
<template lang="pug">
  .page
    .search-form.mb-10.pl-10.pr-10
      Row(type="flex" justify="start")
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 客户名称：
          Input(v-model="formData.customerName" placeholder="请输入" clearable)
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 签约销售：
          .choose-saler
            Tooltip(placement="bottom" max-width="200" :disabled="!tipIsShow" theme="light")
              Input.input(v-model="dolderNames" type="text" readonly clearable @on-clear="salersClear")
              div(slot="content")
                .font-14 {{dolderNames}}
            .button(@click="chooseSaler") 选择
          //- Input(v-model="formData.saler" placeholder="请输入" clearable)
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w110 项目经理/助理：
          Input(v-model="formData.serverName" placeholder="请输入" clearable)
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 状态：
          Select(v-model="formData.status"  placeholder="请选择" clearable)
            Option(v-for="(item, index) in productdeliverystatus" :value="item.key" :key="item.key") {{ item.value }}
          Button.ml-15(v-if="hasFind" type="info" @click="searchFn") 查询
    .pl-20.pr-20.bg-white
      Table.hasTitle-table.beautiful-table(width="100%" stripe :columns="setThead" :loading="loading" :data="tableData" @on-selection-change="handleOnSelectChange")
        div(slot="header")
          .pull-left.table-title-btns
            span.leftText
              | 待分配项目数:
              span.text-info.pl-5.pr-5.font-weight {{tableComone.totalRows}}
          .pull-right.table-title-btns
            Button(v-if="hasExport" type="info" @click="exportBtn") 导出
        template(slot-scope="{ row, index }" slot="customerName")
          .u-d-info(@click="gotoDetail(row.customerID)") {{row.customerName}}
        template(slot-scope="{ row, index }" slot="action")
          Button(v-if="hasCancel" type="info" :disabled="row.status !== 1" size="small" @click="cancelAssigned(row.id)") 撤销
        .clearfix.pl-20.pr-20(slot="footer")
          Page(
            :current="tableComone.pageIndex"
            :total="tableComone.totalRows"
            @on-change="onChangePage"
            @on-page-size-change="onpageSizeChange"
            show-sizer
            show-total
            placement="top"
            :page-size-opts="[10, 20, 30, 50, 100]"
          )
    visibvleTreeList(ref="treeModal" :treeData="treeData" @on-change="getSalerId")
</template>

<script>
import Mixin from '../../deliveryManage/deliverMixin.js'
import _cloneDeep from 'clone-deep'
// import AddInfoModal from './modal/addInfoModal.vue'
import { ProductDeliveryApi } from '@/api/ProductDelivery.api.js'
import { incompleteThead } from '../../deliveryManage/tableHead.js'

export default {
  name: 'hrdc-incomplete',

  data () {
    return {
      isEmpty: false,
      selectModal: false,
      server_arr: [],
      serverID: '',
      serverName: '',
      loading: false,
      formData: {
        customerName: '',
        saler: '',
        serverName: '',
        status
      },
      selectedId: [], // 勾选的id集合,array格式
      thead: _cloneDeep(incompleteThead),
      // thead: ['selection','a','b','c','d','a_1','a_2','a_3','b_1','b_2','b_3','b_4','c_1','d_2','l'],
      tableData: [],
      tableComone: {
        pageIndex: 1, // 页码
        totalRows: 0, // 总条数
        pageSize: 10, // 当前页面展示条数
        inServiceCount: 0, // 在职
        outServiceCount: 0 // 离职
      },
      formValidate: {
        serverID: '',
        serverName: '',
        completeTime: this.$moment(new Date()).format('YYYY-MM-DD HH:mm')
      },
      ruleValidate: {
        serverID: [
          { required: true, message: '项目经理/助理不能为空', trigger: 'change' }
        ],
        completeTime: [
          { required: true, message: '完成时间不能为空', trigger: 'change' }
        ]
      }
    }
  },

  mixins: [Mixin],

  components: {
    // AddInfoModal
  },

  computed: {
    setThead () {
      return this.thead.splice(0, 18)
    },
    actionArr () {
      let arr = this.$store.state.user.actionAccess.map(item => {
        return item.code
      })
      console.log(this.$store.state.user.actionAccess)
      return arr
    },
    // 查询
    hasFind () {
      return this.actionArr.indexOf('GetProductDeliveryList') > -1
    },
    // 导出
    hasExport () {
      return this.actionArr.indexOf('ExportProductDeliveryList') > -1
    },
    // 撤销
    hasCancel () {
      return this.actionArr.indexOf('CancelProductDelivery') > -1
    },
    // 查看课后报告
    hasGetClassReport () {
      return this.actionArr.indexOf('GetClassReport') > -1
    }
  },
  watch: {
    $route (to, from) {
      if (to.name === 'hrdc-assign') {
        this.query()
      }
    }
  },

  mounted () {
    this.query()
    this.getServers()
    this.getEnum()
    // console.log('this.thead: ', this.thead)
    // console.log('this.setThead: ', this.setThead)
  },

  methods: {
    confirmBtn (name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          this.addServer()
        } else {
        }
      })
      // if (this.serverID) {
      //   if (valid) {
      //     this.addServer()
      //   } else {

      //   }
      // } else {
      //   this.isEmpty = true
      // }
    },
    serverChange (val) {
      if (val) {
        this.formValidate.serverName = val.label
        this.formValidate.serverID = val.value
      } else {
        
      }
    },
    selectServer () {
      if (this.selectedId.length > 0) {
        this.selectModal = true
      } else {
        this.$Message.warning('请先选择需要分配的项目')
      }
    },
    // 搜索
    searchFn () {
      this.tableComone.pageIndex = 1
      this.query()
    },
    completeTimeChange (val) {
      this.formValidate.completeTime = val
    },

    /**
     * 分页页码变动
     * @param {Number} val pageIndex
     */
    onChangePage (val) {
      this.tableComone.pageIndex = val
      this.query()
    },

    // 表格选择操作
    handleOnSelectChange (value) {
      this.selectedId = value.map((item) => {
        return item.id
      })
    },

    /**
     * 分页页码变动
     * @param {Number} val pageSize
     */
    onpageSizeChange (val) {
      this.tableComone.pageIndex = 1
      this.tableComone.pageSize = val
      this.query()
    },
    /**
     * 分页查询接口
     * @param {Object} obj {pageIndex, pageSize}
     */
    async query () {
      this.loading = true
      var params = {
        CustomerName: this.formData.customerName,
        Saler: this.formData.saler,
        HolderIds: this.salesIds,
        ServerName: this.formData.serverName,
        Status: this.formData.status,
        HasPaging: true,
        PageIndex: this.tableComone.pageIndex,
        PageSize: this.tableComone.pageSize,
        OrderBy: '',
        Asc: true
      }
      let res = await ProductDeliveryApi.GetProductDeliveryList(params)
      this.loading = false
      if (res.data.code === 200 && res.data.success) {
        this.tableData = res.data.data
        this.tableComone.totalRows = res.data.totalRows // 总条数
      } else {
        this.tableData = []
      }
    },

    // 显示弹窗-添加交互完成信息
    handleShowAddInfoModal (row) {
      if (row.serverID) {
        this.$refs.AddInfoModal.show()
        this.$refs.AddInfoModal.formData.productDeliveryID = row.id
        this.$refs.AddInfoModal.formData.contractPayment = row.contractPayment
        this.$refs.AddInfoModal.formData.serverName = row.serverName
        this.$refs.AddInfoModal.formData.payment = row.payment
      } else {
        this.$Message.warning('请先给该项目分配项目经理/助理')
      }
    },

    // 获取项目经理/助理
    getServers () {
      ProductDeliveryApi.getServers().then(res => {
        if (res.data.success) {
          this.server_arr = res.data.data
        } else {
          this.$Message.error({
            content: res.data.message,
            duration: 10,
            closable: true
          })
        }
      })
    },

    // 分配负责助理
    async addServer () {
      var params = {
        IDs: this.selectedId,
        ServerId: this.formValidate.serverID,
        ServerName: this.formValidate.serverName,
        completeTime: this.formValidate.completeTime
      }
      let res = await ProductDeliveryApi.addServer(params)
      if (res.data.success) {
        this.query()
        this.selectModal = false
      } else {
        this.$Message.error({
          content: res.data.message,
          duration: 10,
          closable: true
        })
      }
    },
    // 撤销
    cancelAssigned (id) {
      this.$Modal.confirm({
        title: '提示',
        content: '<p>确定撤销？</p>',
        onOk: () => {
          ProductDeliveryApi.ProjectCancel({
            Id: id
          }).then(res => {
            if (res.data.success) {
              this.$Message.success(res.data.message)
              this.query()
            } else {
              this.$Message.error(res.data.message)
            }
          })
        },
        onCancel: () => {
          
        }
      });
    },
    // 导出
    exportBtn () {
      ProductDeliveryApi.ExportProductDeliveryList({
        CustomerName: this.formData.customerName,
        Saler: this.formData.saler,
        HolderIds: this.salesIds,
        ServerName: this.formData.serverName,
        Status: this.formData.status,
        HasPaging: true,
        PageIndex: this.tableComone.pageIndex,
        PageSize: this.tableComone.pageSize
      }).then(res => {
        if (res.data.success) {
          let objectUrl = res.data.data
          const link = document.createElement('a')
          link.download = ''
          link.href = objectUrl
          link.click()
        } else {
          this.$Message.error(res.data.message)
        }
      })
    }
  }
}
</script>

<style lang="less" scoped>
  .pos-r{
    position: relative;
  }
</style>
